import Taro, { Component } from '@tarojs/taro'
import { View, Picker } from '@tarojs/components'
import Next from '../../../static/user/icon_next.png';
import NavigationBar from '../../../components/navigationBar/index';

import './index.scss'


// 暂时不做
export default class ShopList extends Component {

  config = {
    navigationBarTitleText: '购物',
    "onReachBottomDistance": 50,
  }
  componentDidMount() {
  }

  state = {
    navigationBarHeight: Taro.getStorageSync('navigationBarHeight'),
    list: [
      {
        id: 1,
        avatar: 'https://avatars2.githubusercontent.com/u/1782542?s=180&v=4',
        title: '中鹿岛牧放大黄鱼das发生对抗疗法就是等放假啊数量的克己复礼就是地方',
        desc: '的圣诞帽山姆大叔的中鹿岛牧放大黄鱼发的风景恪大煞风景看了大数据看风景',
        minPrice: '512.00',
        maxPrice: '999.00',
      },
      {
        id: 3,
        avatar: 'https://avatars2.githubusercontent.com/u/1782542?s=180&v=4',
        title: '中鹿岛牧放大黄鱼',
        desc: '的圣诞帽山姆大叔的中鹿岛牧放大黄鱼',
        minPrice: '512.00',
        maxPrice: '999.00',
      },
      {
        id: 2,
        avatar: 'https://avatars2.githubusercontent.com/u/1782542?s=180&v=4',
        title: '中鹿岛牧放大黄鱼',
        desc: '的圣诞帽山姆大叔的中鹿岛牧放大黄鱼',
        minPrice: '512.00',
        maxPrice: '999.00',
      }
    ],
  };

  onReachBottom() {
    console.log('onReachBottom');
  }

  render () {
    const { list } = this.state;
    return (
      <View className='shop-list' style={`margin-top: ${navigationBarHeight}`}>
        <NavigationBar text="购物" />
        {
          list.map(res => (
            <View key={res.id} className="item">
              <Image src={res.avatar} mode="aspectFill" className="cover" />
              <View className="title-line">
                <View className="title">{res.title}</View>
                <View className="price">¥{res.minPrice}-¥{res.maxPrice}</View>
              </View>
              <View className="desc">{res.desc}</View>
            </View>
          ))
        }
      </View>
    )
  }
}

